<!-- 租房确认协议 -->
<template>
	<view>
		<view class="boxlv">
			<view style="height: 30rpx;"></view>
			<view class="m-card m-mg-lr u-p-t-40 u-p-b-50">
				<view class="m-card m-mg-lr u-p-t-20 u-p-b-20 u-flex boxsh u-flex-around u-m-t-30"
					v-for="(item,index) in data" :key='index'>
					<view>
						<u--image :src='item.img' width='76' height='76' radius='0'></u--image>
					</view>
					<view class="u-flex u-flex-between boxlou">
						<view>
							<text class="u-font-32 c5a">{{item.name}}</text>
						</view>
						<view class="boxren" v-if="index<2" @click="getqian(item.url,index)">
							<text>{{item.type}}</text>
						</view>
						<view class="boxrens" v-if="index===2" @click="getqian(item.url,index)">
							<text>{{item.type}}</text>
						</view>
					</view>
				</view>
				<view class="u-m-t-80 u-flex u-flex-center" @click="requestStatus ? sumit() : ''">
					<view class="boxbutt u-font-33">提交审核</view>
				</view>
			</view>
		</view>


		<u-popup :show="show" @close="close" @open="open" mode="top" bgColor="transparent" round="10"
			:customStyle="{ top: '30rpx' }">
			<view class="m-mg-lr m-card boxding">
				<u--form labelPosition="left" :borderBottom="false" :model="xieyi" ref="form1" labelWidth="100"
					:labelStyle="{ fontSize: '24rpx', color: '#5a5a5a' }">
					<u-form-item label="甲方(卖方)" ref="item1">
						<u-search shape="square" searchIcon=" " disabled :clearabled="false" height="64"
							:showAction="false" v-model="xieyi.name" inputAlign="right" bgColor="#eee" placeholder=" ">
						</u-search>
					</u-form-item>
					<u-form-item label="乙方(经纪方)" ref="item1">
						<u-search shape="square" searchIcon=" " disabled :clearabled="false" height="64"
							:showAction="false" v-model="xieyi.broker" inputAlign="right" bgColor="#eee"
							placeholder=" "></u-search>
					</u-form-item>
				</u--form>
				<view class="">
					<view class="c5a u-m-b-20">协议内容</view>
					<u-parse :content="xieyi.leasecontract"></u-parse>
				</view>
				<u--form labelPosition="left" :borderBottom="false" :model="xieyi" ref="form1" labelWidth="100"
					:labelStyle="{ fontSize: '24rpx', color: '#5a5a5a' }">
					<u-form-item label="甲方(卖方)" ref="item1">
						<u-search shape="square" searchIcon=" " disabled :clearabled="false" height="64"
							:showAction="false" v-model="xieyi.name" inputAlign="right" bgColor="#eee" placeholder=" ">
						</u-search>
					</u-form-item>
					<u-form-item label="乙方(经纪方)" ref="item1">
						<u-search shape="square" searchIcon=" " disabled :clearabled="false" height="64"
							:showAction="false" v-model="xieyi.broker" inputAlign="right" bgColor="#eee"
							placeholder=" "></u-search>
					</u-form-item>
				</u--form>
				<view class="u-m-t-30">
					<view class="u-flex">
						<view>
							<u-checkbox-group v-model="checked">
								<u-checkbox activeColor="#0E5642" inactiveColor="#DBB07B"></u-checkbox>
							</u-checkbox-group>
						</view>
						<view><text :class="!checked ? 'cdb' : 'clv'">本人已却读完上述条款，并确认按合同履行相关事务</text></view>
					</view>
				</view>
				<view class="u-m-t-30 u-flex boxali u-flex-center">
					<view class="boxque" :class="!checked ? '' : 'boxquelv'" @click="checked ? getclick() : ''">确认提交
					</view>
				</view>
			</view>
		</u-popup>


	</view>
</template>

<script>
	export default {
		data() {
			return {
				model1: {
					userInfo: {
						name: '',
						yinane: '',
						bing: '',
						identity: '',
						license: '',
						legal: '',
						agent: '',
						telephone: '',
						nationality: '',
						number: '',
						referred: '',
						ality: '',
						passport: '',
						business: '',
						people: '',
						entrust: '',
						address: '',
						international: ''
					},
				},
				show: false,
				data: [{
						img: 'https://neidangjia.oss-accelerate.aliyuncs.com/handhousing/img1.png',
						name: '实名认证',
						type: '去认证',
						url: '/pages/handhousing/authentication'
					},
					{
						img: 'https://neidangjia.oss-accelerate.aliyuncs.com/handhousing/img2.png',
						name: '免责声明协议',
						type: '签署协议',
						url: 'no'
					},
					{
						img: 'https://neidangjia.oss-accelerate.aliyuncs.com/handhousing/img3_on.png',
						name: '家私电器清单',
						type: '点击盘点',
						url: '/pages/zufang/qingdan'
					}
				],
				checked: false,
				n: 0,
				xieyi: {},
				renzheng: false,
				queren: false,
				querens: false
			};
		},
		async onLoad() {
			await this.getxie();
		},
		onShow() {
			let userInfo = JSON.parse(uni.getStorageSync('userInfo'));
			console.log(userInfo.idcard, userInfo.idcarddate);
			if (userInfo.idcard && userInfo.idcarddate) {
				this.renzheng = true;
			}
		},
		methods: {
			async getxie() {
				let res = await this.require('getData', {
					token: JSON.parse(uni.getStorageSync('userInfo')).token
				})
				if (res) {
					this.xieyi = res;
					this.model1.userInfo.name = res.name ? res.name : '';
					this.model1.userInfo.bing = res.broker
				}
			},
			async getclick() { //同意免责协议
				this.show = false;
				// let res = await this.require('yescontract',{
				// 	token: JSON.parse(uni.getStorageSync('userInfo')).token,
				// 	id: 
				// })
				// if(res){
				// 	console.log(res,'???????');
				// }
			},
			change(n) {
				this.n = n.length;
			},
			open() {},
			close() {
				this.show = false
			},
			async getqian(url, index) {
				switch (index) {
					case 0:
						//身份证
						// this.nextNav(url);
						this.nextNav(url + (this.renzheng ? '?type=fangzi' : ''));
						break;
					case 1:
						// 协议
						if (this.querens) {
							this.$u.toast('您签署过协议');
						} else {
							this.show = true;
						}
						break;
					case 2:
						// 协议
						this.nextNav(url + (this.queren ? '?typeid=id' : ''));
						break;
					default:
						break;
				}
			},
			sumit() {
				let fangzi_id = uni.getStorageSync('fangzi_id');
				if (!this.renzheng || !fangzi_id) {
					return this.$u.toast('请实名认证');
				}
				if (!this.querens) {
					return this.$u.toast('请免责声明协议');
				}
				if (!this.queren) {
					return this.$u.toast('请家私电器清单');
				}
				this.nextNav('/pages/mine/shangchuan?fangzi_id=' + fangzi_id);
			}
		}
	}
</script>

<style lang="scss" scoped>
	.ti-psae {
		line-height: 60rpx;
		font-size: 32rpx;
	}

	.y-input {
		display: inline-block;
		width: 200rpx !important;
	}

	.i-suo {
		text-indent: 35rpx;
		line-height: 60rpx;
		font-size: 32rpx;
	}

	.boxlv {
		background-color: #0E5642;
		height: 80rpx;
	}

	.clv {
		color: #0E5642;
	}

	.boxding {
		overflow-y: auto;
		height: 90vh;
	}

	.boxque {
		width: 244rpx;
		height: 60rpx;
		line-height: 60rpx;
		text-align: center;
		color: #fff;
		background-color: #bfbfbf;
		border-radius: 10rpx;
	}

	.boxquelv {
		background-color: #0E5642;
	}

	.boxali {
		align-items: center;
	}

	.cdb {
		color: #DBB07B;
		font-size: 24rpx;
	}

	.c5a {
		color: #5a5a5a;
	}

	.boxbutt {
		width: 352rpx;
		height: 70rpx;
		line-height: 70rpx;
		text-align: center;
		color: #fff;
		background-color: #0E5543;
		border-radius: 10rpx;
	}

	.boxtop {
		left: 30rpx;
		right: 30rpx;
		bottom: 0;
	}

	.c5a {
		color: #5A5A5A;
	}

	.boxlou {
		flex-direction: column;
		align-items: center;
	}

	.boxsh {
		box-shadow: 0 3px 40px 5px rgba(166, 166, 166, .1);
	}

	.boxren {
		width: 234rpx;
		height: 48rpx;
		background-color: #DAAF7F;
		color: #fff;
		line-height: 48rpx;
		text-align: center;
	}

	.boxrens {
		width: 234rpx;
		height: 48rpx;
		background-color: #0E5642;
		color: #fff;
		line-height: 48rpx;
		text-align: center;
	}
</style>
